<template>
  <div class="page">
    <m-header title="客服中心" :canback="Boolean(1)"></m-header>
    <div class="body">
      <!-- <img class="img" src="../../assets/images/gzlz/kefudianhua.png" alt /> -->
      <div class="telephone">{{center.data.text}}</div>
      <div class="tip">
        <img :src="api+center.data.wx_img" alt />
      </div>
    </div>
  </div>
</template>
<script>
import { mapGetters } from 'vuex';
import { Help } from '@/server/server.js'
export default {
  data() {
    return {
      center: null
    }
  },
  computed: {
    ...mapGetters(['api'])
  },
  mounted() {
    Help.getCenter().then(res => {
      if (res) {
        this.center = res
      }
    })
  }
};
</script>
<style lang="less" scoped>
@import "~link-less";
.page {
  background-image: url(../../assets/images/bg4.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.body {
  // background: @bg-color;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  .img {
    margin-top: 107px;
    width: 19.8%;
  }
  .telephone {
    font-size: 28px;
    color: #fff;
    // margin-top: 250px;
  }
  .tip {
    color: white;
    font-size: 28px;
    margin-top: 30px;
    img {
      width: 500px;
      border-radius: 30px;
    }
  }
}
</style>
